const path = require('path')
const {CleanWebpackPlugin} = require('clean-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const webpack = require('webpack')
const CopyWebpackPlugin = require('copy-webpack-plugin')

class myPlugin {
    apply(compiler) {
        console.log('my')
        compiler.hooks.emit.tap('myPlugin', compilation => {
            for (const name in compilation.assets) {
                if (compilation.assets.hasOwnProperty(name)) {
                    if (name.endsWith('.js')) {
                        const contents = compilation.assets[name].source()
                        const withoutComments = contents.replace(/\/\*\*+\*\//g, '')
                        compilation.assets[name] = {
                            source: () => withoutComments,
                            size: () => withoutComments.length
                        }
                    }
                }
            }
        })
    }
}

module.exports = (env, args) => {
    const config = {
        mode: 'none',
        entry: './src/main.js',  //入口文件
        output: {       // 输出文件属性
            filename: 'bundle.js', // 输出文件名
            path: path.join(__dirname, 'dist'),// 输出文件目录  要绝对路径
            // publicPath:'dist/' // 输出文件引用的文件目录
        },
        devServer: {
            contentBase: './public',
            proxy: {
                '/api': {
                    target: 'https:api.github.com',
                    pathRewrite: {
                        '^/api': ''
                    },
                    changeOrigin: true
                }
            },
            // hot: true,
            hotOnly: true
        },
        devtool: 'cheap-module-eval-source-map', //发布时 使用none
        module: {
            rules: [
                {
                    test: /.css$/,
                    use: ['style-loader', 'css-loader']
                },
                {
                    test: /.html$/,
                    loader: 'html-loader',
                    options: {
                        attributes: {
                            list: [
                                {
                                    tag: 'img',
                                    attribute: 'src',
                                    type: 'src',
                                }
                            ]
                        }
                    }
                },
                // {
                //     test: /.js$/,
                //     use: {
                //         loader: 'babel-loader',
                //         options: {
                //             presets: ['@babel/preset-env']
                //         }
                //     }
                // },
                {
                    test: /.jpg$/,
                    use: {
                        loader: 'url-loader',
                        options: {
                            limit: 10 * 1024
                        }
                    }

                }
            ]
        },
        plugins: [
            new CleanWebpackPlugin(),
            new HtmlWebpackPlugin(),
            new myPlugin(),
            new webpack.HotModuleReplacementPlugin()
        ]
    }
    if (env === 'production') {
        config.mode = 'production'
        config.devtool = false
        config.plugins = [
            ...config.plugins,
            new CleanWebpackPlugin(),
            new CopyWebpackPlugin({
                patterns: [{
                    from: 'public/**',
                }]
            })
        ]
    }
    return config
}
